<script setup>
import { reactive, ref } from 'vue';
import { Toast } from 'vant'


const count = ref(0);
const loading = ref(false);
const onRefresh = () => {
    setTimeout(() => {
        Toast('刷新成功');
        loading.value = false;
        count.value++;
    }, 1000);
};
const data = reactive([
    {
        desc: "如一天吃一个鸡蛋会有什么后果？很少有人知道", 
    },
    {
        desc: "描述信息", 
    },
    {
        desc: "描述信息", 
    },
    {
        desc: "描述信息", 
    },
    {
        desc: "描述信息",
    },
    {
        desc: "描述信息"
    },
    {
        desc: "描述信息"
    },
])
</script>
<template>
    <van-pull-refresh v-model="loading" @refresh="onRefresh">
        <van-card class="card-width" v-for="item in data" :key="item"  :desc="item.desc" 
        thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg"  />
    </van-pull-refresh>

</template>
<style scoped>
.goods-card {
    margin: 0;
    background-color: white;
}

.delete-button {
    height: 100%; 
}

</style>